<!DOCTYPE html>
<html >
	<head>
		<meta charset="utf-8" />
		<script type="text/javascript" src="../js/angular.js" ></script>
		<title></title>
		<link rel="stylesheet" href="../css/font-awesome/css/font-awesome.css">
	</head>

	<body ng-app="app" >
		<div ng-controller="ctrl" >
			<input type="text" ng-model="pcolor">
			<hr>
			<newlist color="pcolor" ></newlist>
		</div>
		<script>
			var app=angular.module("app",[]);
			app.directive("newlist",function () {
				return {
					restrict:"E",//a attr e element c class
					template:'<h1 style="color:{{color}}" >内容</h1><input type="text" ng-model="color">',
					scope:{color:"=color"}
				};
			});
			app.controller("ctrl",["$scope",function ($scope) {
				$scope.pcolor="red";
			}]);
		</script>
	</body>
</html>
